<template>
  <el-main class="vertical">
    <el-container style="height:55%;">
      <BasicCrud businessUrl="/org/organizationController" :option="option"
        @current-row-change="handleCurrentRowChange">
        <template #menu-right="{ row }">
          <div style="display: flex;align-items: center;margin-right: 10px;">

          </div>
        </template>
      </BasicCrud>
    </el-container>
    <el-container style="height:45%">
      <BasicCrud businessUrl="/org/orgAdminController" :option="adminOption" :autoLoad="false"
        :apiListParams="listPatrams">
      </BasicCrud>
    </el-container>
  </el-main>
</template>

<script setup>
import { computed } from 'vue';
const adminHeight = ref((document.body.clientHeight - 120) * 0.45 - 75);//0.45是父容器的高度设为45%
const option = ref({
  highlightCurrentRow: true,
  searchShow: false,
  calcHeight: adminHeight.value + 90,
  statusBtn: true,
  menuWidth: 260,
  column: [
    {
      label: "组织全称",
      prop: "name",
      search: true,
      width: 160,
      rules: [
        {
          message: "请输入组织全称",
          required: true,
          trigger: "blur",
        },
      ],
      span: 24,
    },
    {
      label: "英文名称",
      prop: "englishName",
      search: true,
      sortable: "custom",
      width: 200,
      span: 24,
    },
    {
      prop: "shotName",
      label: "组织简称",
      width: 140,
      type: "input",
      span: 12,
    },
    {
      prop: "code",
      label: "编号",
      rules: [
        {
          required: true,
          message: "编号不能为空",
          trigger: "blur",
        },
      ],
      type: "input",
      span: 12,
    },
    {
      label: "法人",
      prop: "principal",
      span: 12,
    },
    {
      label: "联系电话",
      prop: "tel",
      span: 12,
    },
    {
      label: "地址",
      prop: "address",
      span: 24,
    },
    {
      type: "radio",
      label: "开启三员",
      prop: "threeRight",
      dicData: [
        { label: "开启", value: "true" },
        { label: "不开启", value: "false" },
      ],
      value: "true",
      span: 12,
      formatter: (row) => {
        if (row.threeRight === 'true') {
          return '开启';
        } else {
          return '不开启';
        }
      }
    },
    {
      prop: "des",
      label: "描述",
      rule: [],
      type: "textarea",
      value: "",
      span: 24,
    },
  ],
})

const adminOption = ref({
  size: 'small',
  height: adminHeight.value,
  labelWidth: 120,
  column: [
    {
      label: "名称",
      prop: "name",
      width: 160,
      rules: [
        {
          required: true,
          message: "名称不能为空",
          trigger: "blur",
        },
      ],
      span: 12,
    },
    {
      label: "编号",
      prop: "code",
      width: 200,
      rules: [
        {
          required: true,
          message: "编号不能为空",
          trigger: "blur",
        },
      ],
      span: 12,
    },
    {
      prop: "adminPwd",
      label: "管理员密码",
      width: 240,
      rules: [
        {
          required: true,
          message: "管理员密码不能为空",
          trigger: "blur",
        },
      ],
      type: "password",
      span: 12,
    },
    {
      prop: "confirmPwd",
      label: "确认密码",
      width: 140,
      rules: [
        {
          required: true,
          message: "管理员密码不能为空",
          trigger: "blur",
        },
      ],
      type: "password",
      span: 12,
    },
    {
      label: "邮箱地址",
      prop: "email",
      span: 12,
    },
    {
      label: "绑定的IP",
      prop: "bindIps",
      span: 12,
    },
    {
      prop: "des",
      label: "描述",
      rule: [],
      type: "textarea",
      value: "",
      span: 24,
    },
  ],
})
// 当前点击租户
const curTenant = ref({})
// 管理员参数
const listPatrams = computed(() => {
  return {
    tenantId: curTenant.value.id
  }
})
const handleCurrentRowChange = (row) => {
  curTenant.value = row
}
</script>

<style lang='scss' scoped></style>